<template>
    <el-menu default-active="0" @open="handleOpen" @close="handleClose">
        <router-link v-for="(item, index) in tagViewList" :key="index" :to="item.path">
            <el-menu-item >
                <el-icon><icon-menu /></el-icon>
                <span>{{ item.title }}</span>
            </el-menu-item>
        </router-link>
    </el-menu>
</template>
<script lang="ts" setup>
import {
  Document,
  Menu as IconMenu,
  Location,
  Setting,
} from '@element-plus/icons-vue' 

import {ref} from 'vue'

const tagViewList = ref([{
            path:"/categories",
            title:"文章分类"
        },{
            path:"/news",
            title:"新闻列表"
        } 
])

const handleOpen = (key: string, keyPath: string[]) => {
  console.log(key, keyPath)
}
const handleClose = (key: string, keyPath: string[]) => {
  console.log(key, keyPath)
}
</script>
<style scoped></style>